// 导入 hairline.scss
@import '@scss/hairline.scss';

.box {
  // 将来写代码直接写px 打包时自动换vw ==> postcss-px-to-viewport
  width: 187.5px;
  height: 200px;
  background-color: teal;
}

// 移动端真正的1px的原理
.demo {
  position: relative;

  &::after {
    content: '';
    border: 1px solid #000; // 手机上放大2倍 变成2px
    transform: scale(0.5); // 缩放0.5倍

    width: 200%;
    height: 200%;

    position: absolute;
    top: 0;
    left: 0;

    transform-origin: 0 0; // 将转换远点 调整到 左上角

    box-sizing: border-box;
  }
}

.test {
  @include hairline(all, #000);
}

.my-icon {
  width: 30px;
  height: 30px;
}
